<template>
  <!--
        作者：1550495493@qq.com
        时间：2019-08-15
        描述：学生库
    -->
  <div class="PressRelease">
    <div class="search-box">
      <div class="fl">
        <input @click="manually(0)" class="btn-boxs" type="button" value="人工录入" />
        <input class="btn-boxs" type="button" @click="$refs.inputFile.click()" value="数据导入" />
        <input type="file" ref="inputFile" accept=".xls,.xlsx" style="display: none" @click="inputData"/>
        <input class="btn-boxs" type="button" value="数据导出" @click="exportStudent" />
      </div>
      <div class="fr">
        <select class="search" id="searchName" >
          <option value="name">姓名</option>
          <option value="industry">职业</option>
          <option value="identityCard">身份证号</option>
        </select>
        <input class="search" id="searchValue" v-model="searchValue"  type="text" />
        <input type="button" @click="getStudent" value="搜索" class="btn" />
      </div>
    </div>
    <div class="PressRelease-list">
      <table>
        <thead>
        <tr>
          <th class="table-text-th1">姓名</th>
          <th class="table-text-th1">身份证号</th>
          <th class="table-text-th1">联系方式</th>
          <th class="table-text-th2">职业</th>
          <th class="table-text-th1">邮箱</th>
          <th class="table-text-th3">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for=" s in student">
          <td :title="s.name"><span class="show-oneline-table">{{s.name}}</span></td>
          <td :title="s.identityCard"><span class="show-oneline-table">{{s.identityCard}}</span></td>
          <td :title="s.phone"><span class="show-oneline-table">{{s.phone}}</span></td>
          <td :title="s.industry"><span class="show-oneline-table">{{s.industry}}</span></td>

          <td :title="s.reserved2"><span class="show-oneline-table">{{s.reserved2}}</span></td>
          <td><input @click="manually(s.id)" type="button" value="修改" class="delete write" />
            <input @click="toView(s.id)" type="button" value="查看" class="delete write" /></td>
        </tr>
        </tbody>
      </table>
      <!--total  数据总数   size  一页多少条数据   page  当前页码    changge 返回当前选择的页码  改变一页显示条 child  返回值就是一页显示条数  -->
      <pageination :total="total" :size="size" :page="page" :changge="pageFn" @child="obtainChild"></pageination>
    </div>

    <!-- 人工录入-模态框-->
    <div v-show="ApplicationStatus" class="tenant-model">
      <div class="tenant-model-content Application">
        <header class="tenant-model-header">
         	<h3 v-if="!isModify">人工录入</h3>
					<h3 v-if="isModify">修改</h3>
          <span @click="closeModel" class="closeModel">×</span>
        </header>
        <div class="tenant-model-body">
          <div class="search-contain">
            <!--模态框内容板块-->
            <form class="form-box" id="studentForm">
              <div class="form-line input-required">
                <label>姓名：</label>
                <div class="input-box">
                  <input type="text" name="name" v-model="studentObj.name">
                </div>
              </div>
              <div class="form-line input-required">
                <label>身份证号：</label>
                <div class="input-box">
                  <input type="text" name="identityCard" v-model="studentObj.identityCard">
                </div>
              </div>
              <div class="form-line input-required">
                <label>性别：</label>
                <div class="input-box">
                  <select name="reserved" id="reserved">
                    <option value="男">男</option>
                    <option value="女">女</option>
                  </select>
                </div>
              </div>
              <div class="form-line input-required">
                <label>职业：</label>
                <div class="input-box">
                  <input type="text" name="industry"  v-model="studentObj.industry">
                </div>
              </div>
              <div class="form-line input-required">
                <label>联系方式：</label>
                <div class="input-box">
                  <input type="text" name="phone" v-model="studentObj.phone">
                </div>
              </div>
              <div class="form-line input-required">
                <label>电子邮箱：</label>
                <div class="input-box">
                  <input type="text" name="reserved2" v-model="studentObj.reserved2">
                </div>
              </div>
              <!--<div class="search-boxs imgbox">
                                <label>专家头像：</label>
                                <div class="imgbtn">
                                    <input type="file" id="handIdFront" accept="image/*" @change="idFrontImg($event)" style="display: none;" />
                                    <img class="showHandIdFront" />
                                    <a class="Public-btn1 uploadbtn again-upload " @click="touchOffIdInput(1)">重新上传</a>
                                    <a class="Public-btn1 uploadbtn handIdFrontA " @click="touchOffIdInput(1)">上传</a>
                                </div>
                            </div>-->
              <input type="hidden" v-model="testAttachment" name="testAttachment" />
              <input type="hidden" v-model="imageAttachment" name="imageAttachment" />
              <input type="hidden" v-model="videoAttachment" name="videoAttachment" />
              <input type="reset" style="display: none"/>
            </form>
            <div class="tab-tit">
              <a href="javascript:;" @click="clickcurId(0)" :class="{'cur':curId===0}">文本</a>
              <a href="javascript:;" @click="clickcurId(1)" :class="{'cur':curId===1}">图像</a>
              <a href="javascript:;" @click="clickcurId(2)" :class="{'cur':curId===2}">音视频</a>


            </div>
            <div class="tab-con">
              <div v-show="curId===0">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                    <th>删除</th>
                  </tr>
                  <tr v-for="f in FileUpload">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete write" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete writewrite" />
                    </td>

                    <td>
                      <input type="button" value="删除" @click="del(f)" class="delete write" />
                    </td>

                  </tr>
                </table>
              </div>
              <div v-show="curId===1">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                    <th>删除</th>
                  </tr>
                  <tr v-for="f in FileUploadImg">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete write" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete write" />
                    </td>

                    <td>
                      <input type="button" value="删除" @click="del(f)" class="delete write" />
                    </td>

                  </tr>
                </table>
              </div>
              <div v-show="curId===2">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                    <th>删除</th>
                  </tr>
                  <tr v-for="f in FileUploadVideo">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete write" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete write" />
                    </td>

                    <td>
                      <input type="button" value="删除" @click="del(f)" class="delete write" />
                    </td>

                  </tr>
                </table>
              </div>

              <div v-show="curId == 0">
              	<div>
									<button class="upload-img" @click="touchOffIdInput(1)">上传附件</button>
                	<input type="file" multiple id="imageAttachment" accept=".doc,.docx,.xls,.xlsx,.pdf,.html,.txt"
                       @change="idFrontImg($event)" style="display: none;" />
                </div>
              </div>

              <div v-show="curId == 1">
              	<div>
									<button class="upload-img" @click="touchImg(1)">上传附件</button>
                	<input type="file" multiple id="touchImg" accept="image/*"
                       @change="touchUploadImg($event)" style="display: none;" />

              	</div>
							</div>
              <div v-show="curId == 2">
              	<div>
									<button class="upload-img" @click="touchVideo(1)">上传附件</button>
                	<input type="file" multiple id="touchVideo" accept="video/*"
                       @change="idFrontVideo($event)" style="display: none;" />
              	</div>
							</div>
            </div>

          </div>
        </div>
        <footer class="tenant-model-footer">
          <button class="determine" @click="subForm">确认</button>
        </footer>
      </div>
    </div>
    <!--查看-模态框-->
    <div v-show="Application" class="tenant-model">
      <div class="tenant-model-content ApplicationStatus">
        <header class="tenant-model-header">
          <h3>查看</h3>
          <span @click="closeModel" class="closeModel">×</span>
        </header>
        <div class="tenant-model-body">
          <div class="search-contain">
            <!--模态框内容板块-->
            <form class="form-box">
              <div class="form-line ">
                <label>姓名：</label>
                <div class="input-box">
                  {{studentObj.name}}
                </div>
              </div>
              <div class="form-line ">
                <label>身份证号：</label>
                <div class="input-box">
                  {{studentObj.identityCard}}
                </div>
              </div>
              <div class="form-line ">
                <label>性别：</label>
                <div class="input-box">
                  {{studentObj.reserved  }}
                </div>
              </div>
              <div class="form-line ">
                <label>职业：</label>
                <div class="input-box">
                  {{studentObj.industry}}
                </div>
              </div>
              <div class="form-line ">
                <label>联系方式：</label>
                <div class="input-box">
                  {{studentObj.phone}}
                </div>
              </div>
              <div class="form-line">
                <label>电子邮箱：</label>
                <div class="input-box">
                  {{studentObj.reserved2}}
                </div>
              </div>
              <!--<div class="search-boxs imgbox">
                                <label>专家头像：</label>
                                <div class="imgbtn">
                                    <img src="../../images/BaseDetails/2.png" />
                                </div>
                            </div>-->
            </form>
            <div class="tab-tit">
              <a href="javascript:;" @click="clickcurId(0)" :class="{'cur':curId==0}">文本</a>
              <a href="javascript:;" @click="clickcurId(1)" :class="{'cur':curId==1}">图像</a>
              <a href="javascript:;" @click="clickcurId(2)" :class="{'cur':curId==2}">音视频</a>

            </div>
            <div class="tab-con">
              <div v-show="curId==0">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                   <!-- <th>删除</th>-->
                  </tr>
                  <tr v-for="f in FileUpload">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete write" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete write" />
                    </td>

                  <!--  <td>
                      <input type="button" value="删除" @click="del(f)" class="delete" />
                    </td>-->

                  </tr>
                </table>
              </div>
              <div v-show="curId==1">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                 <!--   <th>删除</th>-->
                  </tr>
                  <tr v-for="f in FileUploadImg">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete" />
                    </td>

                 <!--   <td>
                      <input type="button" value="删除" @click="del(f)" class="delete" />
                    </td>-->

                  </tr>
                </table>
              </div>
              <div v-show="curId==2">
                <table>
                  <tr>
                    <th>文本名称</th>
                    <th>在线预览</th>
                    <th>下载</th>
                  <!--  <th>删除</th>-->
                  </tr>
                  <tr v-for="f in FileUploadVideo">
                    <td>{{f.name}}</td>
                    <td>
                      <input type="button" @click="toSrc(f.url)" value="查看" class="delete" />
                    </td>
                    <td>
                      <input type="button" value="下载" @click="downloadResources(f.url)" class="delete" />
                    </td>

               <!--     <td>
                      <input type="button" value="删除" @click="del(f)" class="delete" />
                    </td>
-->
                  </tr>
                </table>
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>

  </div>


</template>
<script src="./StudentsLibrary.js"></script>

<style scoped>
  @import "StudentsLibrary.css";
</style>
